﻿<template>
  <div class="table">
    <div class="divSearch">
      <Row>
        <Col span="24" class="col-margin">
        <!--根据需求删除不不要查询条件-->
        填报年度：
        <Select v-model="searchModel.FillInYear" placeholder="全部" style="width: 100px" @on-change="GetData()">
            <Option value="">全部</Option>
            <Option :value="item.DictText" v-for="item in CreateYearList" :key="item.DictValue">{{item.DictText}}</Option>
        </Select>
        <Button icon="ios-search" type="ghost" @click="GetData()" class="ButtonStyle">查询</Button>
        <Button icon="ios-download" type="primary" @click="ExcelDown()" class="searchButton" style="float:right;width: 100px;">数据导出</Button>
        <Upload :on-success="handleSuccess" :action="GetPostUrl()" style="float:right;width: 100px;" v-show="DataModel.ReportStatus <3">
          <Button type="primary" icon="ios-cloud-upload-outline" class="searchButton" >数据导入</Button>
        </Upload>
        <Button icon="ios-cloud-download" type="primary" @click="TmpDown()" class="searchButton" style="width: 100px;">模板下载</Button>
        <!-- <label style="float:right;padding: 6px;font-size:16px;">当前状态:
            <span v-if="DataModel.ReportStatus==0" class="Error"></span> 
            <span v-else-if="DataModel.ReportStatus==1" class="NoReport">未填写</span>
            <span v-else-if="DataModel.ReportStatus==2" class="AlreadyReport">已填写</span>
            <span v-else-if="DataModel.ReportStatus==3" class="UpReport">已上报</span>
            <span v-else-if="DataModel.ReportStatus==4" class="Success">审核通过</span>               
        </label> -->
        </Col>
      </Row>
    </div>
      <Row>
        <Col>
            <Form ref="DataModel" :model="DataModel" :rules="ruleModel">
                <table class="reptable">
                    <caption>
                        <label style="float:left">{{searchModel.FillInYear}}表3全年蚕桑生产情况调查表</label>
                        <label style="float:right">当前状态:
                        <!-- <span v-if="DataModel.ReportStatus==0" class="Error">重新填写</span>  -->
                        <Poptip trigger="hover" placement="left-start" v-model="visible" :content="ReportOpinion" v-if="DataModel.ReportStatus==0">
                            <span  class="Error">重新填写</span> 
                        </Poptip>
                        <span v-else-if="DataModel.ReportStatus==1" class="NoReport">未填写</span>
                        <span v-else-if="DataModel.ReportStatus==2" class="AlreadyReport">已填写</span>
                        <span v-else-if="DataModel.ReportStatus==3" class="UpReport">已上报</span>
                        <span v-else-if="DataModel.ReportStatus==4" class="Success">审核通过</span>  
                        <span v-else class="NoReport">无需填报</span>                  
                        </label><br/>
                    </caption>
                    <tr style="height:40px;">
                    <th colspan="2">生丝</th>
                    <th colspan="2">丝绸</th>
                    <th colspan="2">蚕丝被</th>
                    </tr>
                    <tr>
                    <th>产量<br/>（吨）</th>
                    <th>产值<br/>（万元）</th>
                    <th>产量<br/>（万米）</th>
                    <th>产值<br/>（万元）</th>
                    <th>产量<br/>（吨）</th>
                    <th>产值<br/>（万元）</th>
                    </tr>
                    <tr style="height:40px;">
                    <td>
                        <Poptip trigger="focus" title="上年数据" :content="DataModel.OldRawSilkYield" placement="bottom">
                        <Form-item prop="RawSilkYield">
                            <Input v-model="DataModel.RawSilkYield" placeholder="请输入生丝产量"></Input>
                        </Form-item>
                        </Poptip>
                    </td>
                    <td>
                        <Poptip trigger="focus" title="上年数据" :content="DataModel.OldRawSilkValue" placement="bottom">
                        <Form-item prop="RawSilkValue">
                            <Input v-model="DataModel.RawSilkValue" placeholder="请输入生丝产值"></Input>
                        </Form-item>
                        </Poptip>
                    </td>
                    <td>
                        <Poptip trigger="focus" title="上年数据" :content="DataModel.OldSilkYield" placement="bottom">
                        <Form-item prop="SilkYield">
                            <Input v-model="DataModel.SilkYield" placeholder="请输入丝绸产量"></Input>
                        </Form-item>
                        </Poptip>
                    </td>
                    <td>
                        <Poptip trigger="focus" title="上年数据" :content="DataModel.OldSilkValue" placement="bottom">
                        <Form-item prop="SilkValue">
                            <Input v-model="DataModel.SilkValue" placeholder="请输入丝绸产值"></Input>
                        </Form-item>
                        </Poptip>
                    </td>
                    <td>
                        <Poptip trigger="focus" title="上年数据" :content="DataModel.OldSilkQuiltYield" placement="bottom">
                        <Form-item prop="SilkQuiltYield">
                            <Input v-model="DataModel.SilkQuiltYield" placeholder="请输入蚕丝被产量"></Input>
                        </Form-item>
                        </Poptip>
                    </td>
                    <td>
                        <Poptip trigger="focus" title="上年数据" :content="DataModel.OldSilkQuiltValue" placement="bottom">
                        <Form-item prop="SilkQuiltValue">
                            <Input v-model="DataModel.SilkQuiltValue" placeholder="请输入蚕丝被产值"></Input>
                        </Form-item>
                        </Poptip>
                    </td>
                    </tr>
                </table>
            </Form>
            <!-- <Modal v-model="showType" :mask-closable="false" width="1200">
                <p slot="header" class="title">
                <Icon type="ios-paper" size="20"></Icon>
                <span style="font-size: 20px">表3全年蚕桑生产情况</span>
                </p>
                <p slot="close">
                <Icon type="close-circled" color="red" size=25></Icon>
                </p>

                <div slot="footer"></div>
            </Modal> -->
          <div class="divButton">
                <Button type="primary" @click="save('DataModel')" :disabled="DataModel.ReportStatus < 3 && BtnSaveStatus ? false:true">保存</Button>
                <Button type="primary" @click="DataUp()" :disabled="DataModel.ReportStatus == 2 ? false:true">上报</Button>
        </div>
        <table class="reptable" v-show="DataModel.ReportStatus == 3"><!-- 数据上报后才显示全年的合并数据 -->
            <tr style="height:40px;">
                <!-- <th rowspan="2">县（市、区）</th> -->
                <th rowspan="2">年份</th>
                <th rowspan="2">投产桑园面积<br/>（亩）</th>
                <th colspan="4">发种量<br/>（张）</th>
                <th colspan="4">鲜茧总产量<br/>（吨）</th>
                <th colspan="4"> 鲜茧均价<br/>（元/公斤）</th>
                <th colspan="4">小蚕共育<br/>（张）</th>
                <th colspan="2">生丝</th>
                <th colspan="2">丝绸</th>
                <th colspan="2">蚕丝被</th>
            </tr>
            <tr>
                <th>合计</th>
                <th>春</th>
                <th>夏</th>
                <th>秋</th>
                <th>合计</th>
                <th>春</th>
                <th>夏</th>
                <th>秋</th>
                <th>合计</th>
                <th>春</th>
                <th>夏</th>
                <th>秋</th>
                <th>合计</th>
                <th>春</th>
                <th>夏</th>
                <th>秋</th>
                <th>产量<br/>（吨）</th>
                <th>产值<br/>（万元）</th>
                <th>产量<br/>（万米）</th>
                <th>产值<br/>（万元）</th>
                <th>产量<br/>（吨）</th>
                <th>产值<br/>（万元）</th>
            </tr>
            <tr v-for="item in datas" style="height:40px;" :key="item.Name">
                <td style="text-align:right;padding: 4px 7px;">{{item.Name}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.IntoMulArea|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.SeedSizeTotal|integer|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.SeedSizeSpring|integer|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.SeedSizeSummer|integer|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.SeedSizeAutumn|integer|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.FCYTotal|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.FCYSpring|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.FCYSummer|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.FCYAutumn|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.AFCTotal|decimal}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.AFCSpring|decimal}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.AFCSummer|decimal}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.AFCAutumn|decimal}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.SRSTotal|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.SRSSpring|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.SRSSummer|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.SRSAutumn|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.RawSilkYield|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.RawSilkValue|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.SilkYield|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.SilkValue|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.SilkQuiltYield|decimal|formatCurrency}}</td>
                <td style="text-align:right;padding: 4px 7px;">{{item.SilkQuiltValue|decimal|formatCurrency}}</td>
            </tr>
        </table>
        <Alert style="margin-top:5px;text-align:left;font-size: 14px;" banner type="error">
            <!-- <p style="color:red;">填报说明:</p>
            <p>1.发种量合计=春+夏+秋季发种量;</p>
            <p>2.鲜茧总产量合计=春+夏+秋季鲜茧总产量；</p>
            <p>3.鲜茧均价=（春季鲜茧总产量*春季鲜茧价格+夏季鲜茧总产量*夏季鲜茧价格+秋季鲜茧总产量*秋季鲜茧价格）/全年鲜茧总产量；</p>
            <p>4.小蚕共育合计=春+夏+秋小蚕共育张数。</p>
            <p style="color:red;font-size: 16px;">特别注意：若指标项没有数据，请直接填“0”</p>
            <span slot="desc"></span> -->
        </Alert>
        </Col>
      </Row>
  </div>
</template>
<script>
export default{
    data() {
        //整数或保留一位小数
        const validateData = (rule, value, callback) => {
            var reg = /\S/;
            var temp = /^[0-9]\d*(\.\d+)?$/;//数字验证
            var p=/^[0-9]+([.]{1}[0-9]{1})?$/;//匹配整数或带一个小数
            if (reg.test(value)) {
            if (temp.test(value) == false) 
            {
                callback(new Error("必须是大于等于0的数字"));
            }
            else {
                if(p.test(value)==false)
                {
                callback(new Error("只能保留一位小数"));
                }
                else{
                callback();
                }
            }
            } 
            else {
            callback(new Error("不能为空"));
            }
        };
        return{
            self: this,
            datas: {},
            visible:true,
            ReportOpinion:'',
            reId:'',
            showType: false,
            CreateYearList: this.GetGroupDict("ReportYear"), //年份
            CurrentYear: this.GetCurrentYear(),//当前年度
            BtnSaveStatus: false,//保存按钮开关
            //查询模型：根据需求删除不不要查询条件
            searchModel: {
                ReportCode: 'MulAnnualProducStatist',
                FillInYear: '',
                TimesType: '',
                AreaCode: this.GetlocaStorage("CSuserinfo").AreaCode,
                PageNumber: 1, 
                PageSize: 20
            },
            DataModel: {//编辑模型
                ReportCode: 'MulAnnualProducStatist',
                FillInYear: '',
                TimesType: '',
                AreaCode: this.GetlocaStorage("CSuserinfo").AreaCode,
                Id: 0,
                ReportId: '',
                RawSilkYield: '',
                RawSilkValue: '',
                SilkYield: '',
                SilkValue: '',
                SilkQuiltYield: '',
                SilkQuiltValue: '',
                //上一年数据
                OldId: 0,
                OldReportId: '',
                OldRawSilkYield: '',
                OldRawSilkValue: '',
                OldSilkYield: '',
                OldSilkValue: '',
                OldSilkQuiltYield: '',
                OldSilkQuiltValue: '',
            },
            ruleModel:{
                RawSilkYield:[{validator: validateData, trigger: 'blur'}],
                RawSilkValue:[{validator: validateData, trigger: 'blur'}],
                SilkYield:[{validator: validateData, trigger: 'blur'}],
                SilkValue:[{validator: validateData, trigger: 'blur'}],
                SilkQuiltYield:[{validator: validateData, trigger: 'blur'}],
                SilkQuiltValue:[{validator: validateData, trigger: 'blur'}]
            },
            ctx: this, //table数据上下文
            clientHeight: window.innerHeight - 270, //表格默认高度
        }
    },
    mounted() {
        //table高度计算方法
        const that = this;
        window.onresize = () => {
            return (() => {
                that.clientHeight = window.innerHeight - 220;
            })()
        };
    },
    methods:{
        //获取今往年数据
        GetData: function () {
            var self = this;
            var model = new Object();
            model.ReportCode = self.searchModel.ReportCode;
            if (self.searchModel.FillInYear != null && self.searchModel.FillInYear != '') {
                model.FillInYear = self.searchModel.FillInYear;
            } else {
                model.FillInYear = self.CurrentYear + '年';//填报年度-----数据字典值
                self.searchModel.FillInYear = self.CurrentYear + '年';
            }
            model.AreaCode = self.searchModel.AreaCode;
            self.DataModel={};//清空当前数据            
            self.$http.post("Report/PostData", model).then( //获取数据编辑项的值
                function (res) {
                    if (res.data.list.status == 2 || res.data.list.status == 1) {
                        self.DataModel = res.data.list.model;
                        self.ReportOpinion=res.data.Opinion;
                        self.reId = self.DataModel.ReportId;
                        self.BtnSaveStatus = true;
                    } else {
                        self.DataModel = res.data.list.model;
                        self.$Modal.warning({
                            title: "提示信息",
                            content: res.data.list.message
                        });
                        self.BtnSaveStatus = false;
                    }
                }
            );
        },
        checkEmpty(value){//验证数值是否正确
            if(value != null&& value!=""&&value!=" "||value==0||value=="0"){
                return true;
            }else{
                return false;
            }
        },
        //保存方法
        save(name) {
            var self = this;
            this.$refs[name].validate((valid) => {
                if (valid) {
                    this.$http.put('MulAnnualProducStatist', self.DataModel).then(
                        function(res) {
                            if (res.data.status == 1) {
                                self.GetData();
                                self.GetDataLIST();
                                self.$Notice.success({
                                    title: '数据保存成功！',
                                    desc: false
                                });
                            } else {
                                self.$Modal.warning({
                                    title: "提示信息",
                                    content: "更新失败,请与管理员联系!"
                                });
                            }
                    });
                }
                else{
                    this.$Notice.error({
                            title: '数据验证出错,请根据提示操作后再试!',
                            desc: '',
                        });
                }
            });
        },
        //获取全年完整的数据
        GetDataLIST(){
            var self = this;
            var model = new Object();
            self.showType = true;
            model.Id = self.reId;
            model.AreaCode = self.searchModel.AreaCode;
            model.FillInYear = self.searchModel.FillInYear;
            self.$http.post("MulAnnualProducStatist/PostDataList", model).then( //获取数据编辑项的值
                function (res) {
                   self.datas = res.data;
                }
            );
        },                
        //数据上报
        DataUp() {
            var self = this;
            self.$Modal.confirm({
                title: '提示信息',
                content: '<p>数据上报后，不能再更改，是否继续上报？</p>',
                onOk: () => {
                    var model = new Object();
                    model.Id = self.DataModel.ReportId;
                    model.reportType = '3';
                    model.strMsg = '';
                    this.$http.post("Report/PostUpStatus", model).then(
                        function (res) {
                            if (res.data.status == 1) {
                                self.$Notice.success({ title: '数据上报成功！', desc: false });
                                self.GetData();
                                self.GetDataLIST();
                            }
                            else {
                                self.$Modal.warning({ title: "提示信息", content: res.data.message });
                            }
                        }
                    );
                }
            });
        },
        //导入
        GetPostUrl(){
           var url= this.$http.defaults.baseURL + "Report/PostImportData?FillInYear="+this.searchModel.FillInYear+"&&ReportCode=" +this.searchModel.ReportCode+"&&AreaCode="+this.searchModel.AreaCode;
           return url;
        },
        handleSuccess(res, file) {//导入成功响应事件
            var self = this;
            self.GetData();
            self.$Notice.success({
                title: '数据导入成功！',
                desc: false
            });
        }, 
        ExcelDown:function(){//导出
            var self = this;
            var model = new Object();
            model.ReportCode = self.searchModel.ReportCode;
            if (self.searchModel.FillInYear != null && self.searchModel.FillInYear != '') {
                model.FillInYear = self.searchModel.FillInYear;
            } else {
                model.FillInYear = self.CurrentYear + '年';//填报年度-----数据字典值
                self.searchModel.FillInYear = self.CurrentYear + '年';
            }
            model.AreaCode = self.searchModel.AreaCode;
            window.open(this.$http.defaults.baseURL + "MulAnnualProducStatist/GetExcelData?ReportCode=" + model.ReportCode+"&&FillInYear="+model.FillInYear+"&&AreaCode="+model.AreaCode+"&&ReportId="+self.reId);
        }, 
        TmpDown: function () {//模板下载
            window.open(this.$http.defaults.baseURL + "Report/GetTemplateData?ReportCode=" + this.searchModel.ReportCode);
        },
    },
    //创建Vue页面方法
    created: function () {
        //创业Vue前调用获取this.datas: {},//table数据对象
        this.GetData();
        this.GetDataLIST();
    },
    watch: {
        //需要监听的在此处新增监听对象
    }
}
</script>
